<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<html>
<head>
    <title>代理商管理系统</title>
    <link rel="stylesheet" type="text/css" href="${ctx}/statics/easyui/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="${ctx}/statics/easyui/themes/icon.css" />
    <link rel="stylesheet" type="text/css" href="${ctx}/statics/easyui/themes/color.css" />
    <link rel="stylesheet" type="text/css" href="${ctx}/statics/easyui/themes/demo.css" />
    <script src="${ctx}/statics/easyui/jquery.min.js" type="text/javascript"></script>
    <script src="${ctx}/statics/easyui/jquery.easyui.min.js" type="text/javascript"></script>
    <script src="${ctx}/statics/easyui/easyui-lang-zh_CN.js" type="text/javascript"></script>
</head>
<body class="easyui-layout" >
    <div data-options="region:'west',split:false" style="width:160px;height:100%;background:#eee;">
        <ul style="list-style:none;padding-left:0">
            <c:forEach items="${requestScope.allRoleList}" var="role" >
                <li style="text-align:center;padding-top:20px"><a href="javascript:void(null)" class="easyui-linkbutton c6"
                                                style="text-decoration:none;font-size:13px;width:120px" onclick="showTreeGrid('${role.id}')">${role.roleName}</a></li>
            </c:forEach>
        </ul>
    </div>
    <div data-options="region:'center'" style="height:100%;" >
        <div id="tool" style="height:40px;background:#eee;">
            <a href="javascript:void(null)" class="easyui-linkbutton" onclick="showAll()"
               data-options="iconCls:'icon-edit'" style="margin-left:30px;margin-top:7px;display:none">展开全部</a>
            <a href="javascript:void(null)" class="easyui-linkbutton" onclick="closeAll()"
               data-options="iconCls:'icon-cut'" style="margin-left:30px;margin-top:7px;display:none">收起全部</a>
        </div>
        <table id="tt" style="width:100%;height:100%" ></table>
    </div>
    <script>
        //展开全部treegrid
        function showAll()
        {
            $('#tt').treegrid( 'expandAll' );
        }

        //收起全部treegrid
        function closeAll()
        {
            $('#tt').treegrid( 'collapseAll' );
        }

        function showTreeGrid( roleId )
        {
            $("#tool").children("a").show();
            //alert( "roleId: " + roleId );
            $('#tt').treegrid(
                {
                    url:'${ctx}/do/roleFuncManage?roleId=' + roleId ,
                    idField:'id',
                    treeField:'name',
                    animate:true,
                    fitColumns:true,
                    striped:true,
                    fit:true,
                    rownumbers:true,
                    columns:
                        [
                            [
                                {field:'name',title:'功能名称',width:'20%',align:'left' , halign:'center' },
                                {field:'funcUrl',title:'功能url',width:'20%',align:'center' },
                                {field:'creationTime',title:'创建时间',width:'20%',align:'center' },
                                {field:'isStart',title:'是否启用',width:'20%',align:'center',
                                    formatter: function( value , row , index)
                                    {
                                        return (row.isStart?"启用":"不启用" )
                                    },
                                    styler: function(value,row,index)
                                    {
                                        return ( row.isStart?"color:green":"color:red" );
                                    }
                                },
                                {field:'control',title:'操作',width:'20%', align:'center',
                                    formatter: function( value , row , index)
                                    {
                                        if( row.parentId == 0 )
                                            return "默认";
                                        else
                                        {
                                            //alert( typeof row.premission  );
                                            //alert(typeof row.premission );
                                            return '<input  id="c' + row.id + '" value="' + row.id + '" name="switch"  ' +
                                                'class="easyui-switchbutton" ' + (row.premission?'checked':'') +
                                                ' style="width:100px;" ' +
                                                'data-options="onText:\'已授予\',offText:\'未授权\',handleText:\'T\'" />';
                                        }
                                    }
                                }
                            ]
                        ],
                    onLoadSuccess:function()
                    {
                        //为每个switchbutton注册onChange事件
                        $("[name=switch]").each(
                          function ()
                          {
                              $(this).switchbutton(
                                  {
                                      onChange:function( checked )
                                      {
                                          //alert(123);
                                          if( checked )
                                          {
                                              $.ajax(
                                                  {
                                                      type:'POST',
                                                      url:'${ctx}/do/addOrUpdatePremission',
                                                      data:{ "roleId":roleId , "functionId": this.value },
                                                      dataType:'json',
                                                      success:function( jsonStr )
                                                      {
                                                          if( jsonStr.success )
                                                          {
                                                              $.messager.alert('修改操作','修改成功','info' );
                                                          }
                                                          else
                                                              $.messager.alert('修改操作','修改失败','warning' );
                                                      }
                                                  }
                                              );
                                          }
                                          else
                                          {
                                              $.ajax(
                                                  {
                                                      type:'POST',
                                                      url:'${ctx}/do/cancelPremission',
                                                      data:{ "roleId":roleId , "functionId": this.value },
                                                      dataType:'json',
                                                      success:function( jsonStr )
                                                      {
                                                          if( jsonStr.success )
                                                          {
                                                              $.messager.alert('修改操作','修改成功','info' );
                                                          }
                                                          else
                                                              $.messager.alert('修改操作','修改失败','warning' );
                                                      }
                                                  }
                                              );
                                          }
                                      }
                                  });
                          });
                    }
                }
            );
        }
    </script>
</body>
</html>
